<%@ page contentType="text/html; charset=utf-8" language="java"
	import="java.sql.*" errorPage=""%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%
	request.setCharacterEncoding("utf-8");
	String cp = request.getContextPath();
	int i=0;
	
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>무제 문서</title>
<link href="<%=cp%>/data/css/common.css" rel="stylesheet"
	type="text/css" />
<link href="<%=cp%>/hotel/SpryAssets/SpryTabbedPanels.css"
	rel="stylesheet" type="text/css" />
<link href="<%=cp%>/data/css/style.css" rel="stylesheet" type="text/css" />
<script src="<%=cp%>/hotel/SpryAssets/SpryTabbedPanels.js"
	type="text/javascript"></script>

<link
	href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css"
	rel="stylesheet" type="text/css" />
<script
	src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script
	src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>

<script language="javascript" type="text/javascript">
	$(document)
			.ready(
					function() {

						//******************************************************************************
						// 상세검색 달력 스크립트
						//******************************************************************************
						var clareCalendar = {
							monthNamesShort : [ '1월', '2월', '3월', '4월', '5월',
									'6월', '7월', '8월', '9월', '10월', '11월', '12월' ],
							dayNamesMin : [ '일', '월', '화', '수', '목', '금', '토' ],
							weekHeader : 'Wk',
							dateFormat : 'yymmdd', //형식(20120303)
							autoSize : false, //오토리사이즈(body등 상위태그의 설정에 따른다)
							changeMonth : true, //월변경가능
							changeYear : true, //년변경가능
							showMonthAfterYear : true, //년 뒤에 월 표시
							buttonImageOnly : true, //이미지표시
							buttonText : '달력선택', //버튼 텍스트 표시
							buttonImage : '<%=cp%>/hotel/image/cal.jpg', //이미지주소
							showOn : "both", //엘리먼트와 이미지 동시 사용(both,button)
							yearRange : '1990:2020' //1990년부터 2020년까지
						};
						$("#checkin").datepicker(clareCalendar);
						$("#checkout").datepicker(clareCalendar);
						$("img.ui-datepicker-trigger")
								.attr("style",
										"margin-left:5px; vertical-align:middle; cursor:pointer;"); //이미지버튼 style적용
						$("#ui-datepicker-div").hide(); //자동으로 생성되는 div객체 숨김  
					});
</script>


<script type="text/javascript">
	function MM_preloadImages() { //v3.0
		var d = document;
		if (d.images) {
			if (!d.MM_p)
				d.MM_p = new Array();
			var i, j = d.MM_p.length, a = MM_preloadImages.arguments;
			for (i = 0; i < a.length; i++)
				if (a[i].indexOf("#") != 0) {
					d.MM_p[j] = new Image;
					d.MM_p[j++].src = a[i];
				}
		}
	}
	function MM_swapImgRestore() { //v3.0
		var i, x, a = document.MM_sr;
		for (i = 0; a && i < a.length && (x = a[i]) && x.oSrc; i++)
			x.src = x.oSrc;
	}
	function MM_findObj(n, d) { //v4.01
		var p, i, x;
		if (!d)
			d = document;
		if ((p = n.indexOf("?")) > 0 && parent.frames.length) {
			d = parent.frames[n.substring(p + 1)].document;
			n = n.substring(0, p);
		}
		if (!(x = d[n]) && d.all)
			x = d.all[n];
		for (i = 0; !x && i < d.forms.length; i++)
			x = d.forms[i][n];
		for (i = 0; !x && d.layers && i < d.layers.length; i++)
			x = MM_findObj(n, d.layers[i].document);
		if (!x && d.getElementById)
			x = d.getElementById(n);
		return x;
	}

	function MM_swapImage() { //v3.0
		var i, j = 0, x, a = MM_swapImage.arguments;
		document.MM_sr = new Array;
		for (i = 0; i < (a.length - 2); i += 3)
			if ((x = MM_findObj(a[i])) != null) {
				document.MM_sr[j++] = x;
				if (!x.oSrc)
					x.oSrc = x.src;
				x.src = a[i + 2];
			}
	}
</script>

<script type="text/javascript">

	function japanClick(){
		
		var f = document.myForm;
		f.action = "<%=cp%>/hotel/hotelList.action";
		f.submit();
		
	}

	function chinaClick(){
		
		var f = document.myForm;
		f.action = "<%=cp%>/hotel/chinaList.action";
		f.submit();
		
	}
	
	function asiaClick(){
		
		var f = document.myForm;
		f.action = "<%=cp%>/hotel/asiaList.action";
		f.submit();
		
	}
	
	function canadaClick(){
		
		var f = document.myForm;
		f.action = "<%=cp%>/hotel/canadaList.action";
		f.submit();
		
	}
	
	
	function europeClick(){
		
		var f = document.myForm;
		f.action = "<%=cp%>/hotel/europeList.action";
		f.submit();
		
	}
	
	function oceaniaClick(){
		
		var f = document.myForm;
		f.action = "<%=cp%>/hotel/oceaniaList.action";
		f.submit();
		
	}
	
	function sehachClick(){
		
		var f = document.myForm;
		f.action = "<%=cp%>/hotel/seachList.action";
		f.submit();
		
	}


</script>



</head>

<body style="font-weight: 'normal';">

<form name="myForm" method="post" action="">
	<div id="container">
		<table width="800" border="1">
			<tr>
				<th width="323" rowspan="5" scope="col" valign="top">

					<table style="font-weight: normal;" height="279" width="318" background="image/background.png">
						<tr>
							<td valign="top" colspan="2">
								<center>
									<img src="<%=cp%>/hotel/image/seach.png" width="310" height="46" />
								</center></td>
						</tr>
						<tr>
							<td valign="top" colspan="2" align="left"><font
								color="#2977c9">&nbsp;<b>호텔일정</b></font></td>
						</tr>
						<tr>
							<td valign="top" colspan="2" align="left" height="35">
								&nbsp;숙박도시<font color="red">*</font><br /> &nbsp;
								<input type="text" name="hotelNationNo" size="45" id="textfield" /></td>
						</tr>


						<tr>
							<td align="left" height="30">&nbsp;체크인<font color="red">*</font><br />&nbsp;<input
								name="checkin" type="text" id="checkin" size="15" maxlength="8"
								title="시작일자" />
							</td>
							<td align="left" height="30">&nbsp;체크아웃<font color="red">*</font><br />&nbsp;<input
								name="checkout" type="text" id="checkout" size="15"
								maxlength="8" title="종료일자" />
							</td>
						</tr>

						<tr>
							<td colspan="2" align="left" height="30">&nbsp;객실타입선택<font
								color="red">*</font>&nbsp;&nbsp;&nbsp;&nbsp;No.1 
								<select name="bedType">
									<option value="베드타입" selected="selected">베드타입</option>
									<option value="1">싱글</option>
									<option value="2">더블</option>
									<option value="3">트리플</option>
									<option value="4">쿼트</option>
								</select> 
							<select name="inwon">
									<option value="인원수" selected="selected">인원수</option>
									<option value="1">1인</option>
									<option value="2">2인</option>
									<option value="3">3인</option>
									<option value="4">4인</option>
									<option value="5">5인</option>
									<option value="6">6인</option>
									<option value="7">7인</option>

							</select></td>
						</tr>

						<tr>
							<td align="left" height="20">&nbsp;</td>
							<td align="left" height="20"><font color="#2977c9"><b>+</b>
							</font>객실추가 <font color="#2977c9"><b>-</b> </font>객실삭제</td>
						</tr>

						<tr>
							<td valign="top" align="left" height="20" colspan="2"><input
								type="checkbox" />지금바로 확정가능한 호텔만 검색하는 경우 선택검색</td>
						</tr>

						<tr>
							<td valign="top" align="left" height="20">&nbsp;</td>
							<td valign="top" align="right" height="20">
							<input type="image" src="<%=cp%>/hotel/image/hotelseach.png" onclick="sehachClick();"/></td>
						</tr>

					</table> <br /> <img src="<%=cp%>/hotel/image/gogak.png" width="318" height="163" />
				</th>
				<th height="183" colspan="2" valign="top" scope="col"><div
						id="TabbedPanels1" class="TabbedPanels">
						<ul class="TabbedPanelsTabGroup">

							<li class="TabbedPanelsTab" tabindex="0">
							<img
								src="<%=cp%>/hotel/image/a.png" border="0" /> 
								<a href="#"
								onmouseout="MM_swapImgRestore()"
								onmouseover="MM_swapImage('Image1','','image/japan.png',1)" 
								onclick="japanClick();">
									<img src="<%=cp%>/hotel/image/japan1.png" name="Image1" width="64"
									height="26" border="0" id="Image1" /> </a>
							</li>

							<li class="TabbedPanelsTab" tabindex="0"><a href="#"
								onmouseout="MM_swapImgRestore()"
								onmouseover="MM_swapImage('Image6','','image/china.png',1)" onclick="chinaClick();">
									<img src="<%=cp%>/hotel/image/china1.png" name="Image6" width="64"
									height="26" border="0" id="Image6" /> </a>
							</li>
							
							<li class="TabbedPanelsTab" tabindex="0"><a href="#"
								onmouseout="MM_swapImgRestore()"
								onmouseover="MM_swapImage('Image7','','image/asia.png',1)" onclick="asiaClick();">
									<img src="<%=cp%>/hotel/image/asia1.png" name="Image7" width="64"
									height="26" border="0" id="Image7" /> </a>
							</li>

							<li class="TabbedPanelsTab" tabindex="0"><a href="#"
								onmouseout="MM_swapImgRestore()"
								onmouseover="MM_swapImage('Image8','','image/canada.png',1)" onclick="canadaClick();">
									<img src="<%=cp%>/hotel/image/canada1.png" name="Image8" width="64"
									height="26" border="0" id="Image8" /> </a>
							</li>

							<li class="TabbedPanelsTab" tabindex="0"><a href="#"
								onmouseout="MM_swapImgRestore()"
								onmouseover="MM_swapImage('Image9','','image/ur.png',1)" onclick="europeClick();"> <img
									src="<%=cp%>/hotel/image/ur1.png" name="Image9" width="64" height="26"
									border="0" id="Image9" /> </a>
							</li>

							<li class="TabbedPanelsTab" tabindex="0"><a href="#"
								onmouseout="MM_swapImgRestore()"
								onmouseover="MM_swapImage('Image5','','image/dy.png',1)" onclick="oceaniaClick();"> <img
									src="<%=cp%>/hotel/image/dy1.png" name="Image5" width="64" height="26"
									border="0" id="Image5" /> </a>
							</li>
						</ul>
						<div class="TabbedPanelsContentGroup">
							<table class="TabbedPanelsContent" style="font-weight: normal;">
								<tr>
								<c:forEach var="dto" items="${lists}"> 
									<td>&nbsp; 
									<table>
									  
									  <tr bgcolor="#FFFFFF">
										<% i=i+1; %>
    									<td align="center" height="30" colspan="3">
    									<a href="javascript:location.href='<%=cp%>/hotel/hotelArcicle.action?hotelNum=${dto.hotelNum}'">
    									<img src="${urllmageFile}/${dto.imageName}" width="113" height="91" border="0" /></a>
											<br /> &nbsp;<b>[${dto.city}]</b><br /> &nbsp;${dto.hotelName }<br /> <font
										color="ed4074">&nbsp;${dto.roomAmount}</font></td>
										</tr>
										</table>
									</td>
									<% 
									   if(i%4 == 0){
									   out.print("</tr>");
									   out.print("<tr>");
									   }
									  %>
									  </c:forEach>
								</tr>
							</table>
							<div class="TabbedPanelsContent">
							<table class="TabbedPanelsContent" style="font-weight: normal;">
								<tr>
								<c:forEach var="dto" items="${lists}"> 
									<td>&nbsp; 
									<table>
									  
									  <tr bgcolor="#FFFFFF">
										<% i=i+1; %>
    									<td align="center" height="30" colspan="3">
    									<a href="javascript:location.href='<%=cp%>/hotel/hotelArcicle.action?hotelNum=${dto.hotelNum}'">
    									<img src="${urllmageFile}/${dto.imageName}" width="113" height="91" border="0" /></a>
											<br /> &nbsp;<b>[${dto.city}]</b><br /> &nbsp;${dto.hotelName }<br /> <font
										color="ed4074">&nbsp;${dto.roomAmount}</font></td>
										</tr>
										</table>
									</td>
									<% 
									   if(i%4 == 0){
									   out.print("</tr>");
									   out.print("<tr>");
									   }
									  %>
									  </c:forEach>
								</tr>
							</table></div>
							<div class="TabbedPanelsContent">
							<table class="TabbedPanelsContent" style="font-weight: normal;">
								<tr>
								<c:forEach var="dto" items="${lists}"> 
									<td>&nbsp; 
									<table>
									  
									  <tr bgcolor="#FFFFFF">
										<% i=i+1; %>
    									<td align="center" height="30" colspan="3">
    									<a href="javascript:location.href='<%=cp%>/hotel/hotelArcicle.action?hotelNum=${dto.hotelNum}'">
    									<img src="${urllmageFile}/${dto.imageName}" width="113" height="91" border="0" /></a>
											<br /> &nbsp;<b>[${dto.city}]</b><br /> &nbsp;${dto.hotelName }<br /> <font
										color="ed4074">&nbsp;${dto.roomAmount}</font></td>
										</tr>
										</table>
									</td>
									<% 
									   if(i%4 == 0){
									   out.print("</tr>");
									   out.print("<tr>");
									   }
									  %>
									  </c:forEach>
								</tr>
							</table>
							
							</div>
							
							<div class="TabbedPanelsContent">
							
							<table class="TabbedPanelsContent" style="font-weight: normal;">
								<tr>
								<c:forEach var="dto" items="${lists}"> 
									<td>&nbsp; 
									<table>
									  
									  <tr bgcolor="#FFFFFF">
										<% i=i+1; %>
    									<td align="center" height="30" colspan="3">
    									<a href="javascript:location.href='<%=cp%>/hotel/hotelArcicle.action?hotelNum=${dto.hotelNum}'">
    									<img src="${urllmageFile}/${dto.imageName}" width="113" height="91" border="0" /></a>
											<br /> &nbsp;<b>[${dto.city}]</b><br /> &nbsp;${dto.hotelName }<br /> <font
										color="ed4074">&nbsp;${dto.roomAmount}</font></td>
										</tr>
										</table>
									</td>
									<% 
									   if(i%4 == 0){
									   out.print("</tr>");
									   out.print("<tr>");
									   }
									  %>
									  </c:forEach>
								</tr>
							</table>
							
							</div>
							<div class="TabbedPanelsContent"><table class="TabbedPanelsContent" style="font-weight: normal;">
								<tr>
								<c:forEach var="dto" items="${lists}"> 
									<td>&nbsp; 
									<table>
									  
									  <tr bgcolor="#FFFFFF">
										<% i=i+1; %>
    									<td align="center" height="30" colspan="3">
    									<a href="javascript:location.href='<%=cp%>/hotel/hotelArcicle.action?hotelNum=${dto.hotelNum}'">
    									<img src="${urllmageFile}/${dto.imageName}" width="113" height="91" border="0" /></a>
											<br /> &nbsp;<b>[${dto.city}]</b><br /> &nbsp;${dto.hotelName }<br /> <font
										color="ed4074">&nbsp;${dto.roomAmount}</font></td>
										</tr>
										</table>
									</td>
									<% 
									   if(i%4 == 0){
									   out.print("</tr>");
									   out.print("<tr>");
									   }
									  %>
									  </c:forEach>
								</tr>
							</table></div>
							<div class="TabbedPanelsContent"><table class="TabbedPanelsContent" style="font-weight: normal;">
								<tr>
								<c:forEach var="dto" items="${lists}"> 
									<td>&nbsp; 
									<table>
									  
									  <tr bgcolor="#FFFFFF">
										<% i=i+1; %>
    									<td align="center" height="30" colspan="3">
    									<a href="javascript:location.href='<%=cp%>/hotel/hotelArcicle.action?hotelNum=${dto.hotelNum}'">
    									<img src="${urllmageFile}/${dto.imageName}" width="113" height="91" border="0" /></a>
											<br /> &nbsp;<b>[${dto.city}]</b><br /> &nbsp;${dto.hotelName }<br /> <font
										color="ed4074">&nbsp;${dto.roomAmount}</font></td>
										</tr>
										</table>
									</td>
									<% 
									   if(i%4 == 0){
									   out.print("</tr>");
									   out.print("<tr>");
									   }
									  %>
									  </c:forEach>
								</tr>
							</table></div>
						</div>
					</div></th>
			</tr>

			<tr>
				<td height="109" rowspan="2" valign="top">
					<table height="46" width="274" border="0" background="image/kong.jpg">
						<tr>
							<td height="26" align="right" valign="bottom">
							<img src="<%=cp%>/hotel/image/more.jpg" height="26" />
							</td>
						</tr>
					</table></td>
				<td height="109" valign="top">
					<table height="46" width="274" border="0" background="image/q.jpg">
						<tr>
							<td height="26" align="right" valign="bottom"><img
								src="<%=cp%>/hotel/image/more.jpg" height="26" />
							</td>
						</tr>
					</table>
					<table width="200" border="0" style="font-weight: normal;">
						<tr>
							<th scope="col" align="left" style="font-weight: normal;">* 자주하는 질문 제목</th>
						</tr>
					</table>
				</td>
			</tr>
		</table>
	</div>
	<script type="text/javascript">
		var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1");
	</script>
</form>
</body>
</html>
